<template>
  <div class="box">
    <header class="header">
      <van-nav-bar
  title="搜索页" left-text="返回" left-arrow  @click-left="onClickLeft" @click="$router.back"/>
    </header>
    <main class="main">
      <van-search
  v-model="value" show-action placeholder="请输入搜索关键词" @search="onSearch">
  <template #action>
    <div @click="onClickButton">搜索</div>
 
  </template>
</van-search>
<div v-for="item in list" :key="item.id">
        <van-card  num="2" :price="item.price" :title="item.title" :thumb="item.image"/>   
      </div>
<van-card
  num="2"
  price="2.00"
  desc="描述信息"
  title="商品标题"
  thumb="https://fastly.jsdelivr.net/npm/@vant/assets/ipad.jpeg"
/>
     
    </main>
  </div>
</template>

<script setup>

import {ref,onMounted, reactive} from 'vue'
import request from '@/tool/request'
const list=ref([])

const value=ref('') 
const qure=()=>{
  request.get('/list',{
    params:{
      value:value.value
    }
  }).then(res=>{
    if(res.data.code==200){
      list.value=res.data.data
    }
  })
}
onMounted(()=>{
  qure()
})
const onSearch=(val)=>{
  qure()
}
</script>

<style lang="scss" scoped>

</style>